<template>
    <div class="container">
        <div class="pad-t-22 flex flex-center">
            <img v-if="fileSpace" :src="fileSpace + '/images/invitation.png'" alt="">
        </div>
        <div class="font-15 font-w font-colot-3 pad-l-30 pad-r-30 mar-t-20">
            【{{nickName}}】邀请你成为他的智能店铺的核销人员是否确认同意？
        </div>
        <div class="btn-box pad-l-22 pad-r-22 flex flex-between">
            <button @click="refuseClick">委婉拒绝</button>
            <button class="confirm-btn" @click="determineClick">确认同意</button>
        </div>
        <div class="delete-box">
            <van-dialog
                message="是否确定该操作？"
                :show="refuseShow"
                show-cancel-button
                @confirm="refuseConfirm"
                @close="closeRefuseDialog"
            >
            </van-dialog>
            <van-dialog
                message="是否确定该操作？"
                :show="determineShow"
                show-cancel-button
                @confirm="determineConfirm"
                @close="closeDetermineDialog"
            >
            </van-dialog>
        </div>
    </div>    
</template>
<script>
import { invitationCancellation } from '@/api/personal'
export default {
  data() {
    return {
      refuseShow: false,
      determineShow: false,
      noClick: false,
      memberId: '', // 邀请人的id
      nickName: '' // 邀请人的昵称
    }
  },
  onShow() {
    console.log('被扫码方的memberId', this.getCurrentPage().query.memberId)
    if (this.getCurrentPage().query.memberId) {
      this.memberId = this.getCurrentPage().query.memberId
    }
    if (this.getCurrentPage().query.nickName) {
      this.nickName = this.getCurrentPage().query.nickName
    }
  },
  methods: {
    refuseClick() {
      if (this.noClick) return
      this.refuseShow = true
    },
    determineClick() {
      if (this.noClick) return
      this.determineShow = true
    },
    refuseConfirm() {
      // 残忍拒绝确定按钮
      this.$pt.reLaunch({ url: '/pages/home/main' })
    },
    closeRefuseDialog() {
      // 关闭拒绝弹出框
      this.refuseShow = false
    },
    determineConfirm() {
      // 确定成为确定按钮
      let params = {
        memberId: this.memberId, // 邀请人id
        verifierMemberId: this.getCustomerId // 受邀人id
      }
      invitationCancellation(params).then((response) => {
        if (response.isError || response.isNetError) return
        // 跳转到个人中心的买家界面
        this.$pt.setStorageSync('personalType', 0)
        // 防止弹窗的时候还可以点击页面按钮
        this.noClick = true
        setTimeout(() => {
          this.noClick = false
          this.$pt.navigateTo({url: '/pages/personal/main?scanning=1'})
        }, 1500)
      }).catch(() => {
      })
    },
    closeDetermineDialog() {
      // 关闭确定弹出框
      this.determineShow = false
    }
  }
}
</script>
<style lang="less" scoped>
.container{
    min-height: 100vh;
    background-color: #fff;
}
.btn-box{
    margin-top: 50px;
    button{
        background: white;
        color: #666666;
        border: 1px solid #c5c5c5;
        border-radius: 25px;
        padding: 10px 40px;
        font-size: 15px;
        line-height: unset;
        &::after{
          border: unset;
        }
    }
    .confirm-btn{
        background: #20b675;
        color: white;
        border: 1px solid #20b675;
    }
}
.delete-box {
    /deep/ .dialog-index--van-dialog__confirm{
      background: #f94035;
      color: white !important;
    }
    /deep/ .dialog-index--van-dialog{
      width: 75%;
    }
    /deep/ .van-dialog__message{
      font-size: 18px;
      font-weight: bold;
      color: #333333;
    }
  } 
</style>
